import React from "react";
import {withRouter} from "react-router-dom";
import {inject, observer} from "mobx-react";
import {WrAccordion, WrAlertPage} from "../../../public";
import {Tools, Popover, Icon} from "weaver-mobile";

const getLabel = Tools.getLabel;
/**
 * 绩效评分头部
 */
@inject("accessViewStore")
@withRouter
@observer
export default class Header extends React.Component {

    constructor(props) {
        super(props);
        this.state = {
            showPopover: false,
        }
        this.store = this.props.accessViewStore;
    }

    componentWillMount() {

    }

    render() {
        const {pesronstr, ccolor, titlename, cstatus, showtype} = this.store;
        const {showMsg} = this.props;
        return <div className="accessView-content-title">
                <span className="accessView-content-title-name">
                    <span style={{color: "#4D7AD8"}}
                          onClick={this.handlePopoverSelect}>{titlename}</span>
                                <span>>{showMsg}</span>
                </span>
            <span className="accessView-content-title-other">
                    <span className="accessView-content-title-audit"
                          dangerouslySetInnerHTML={{__html: pesronstr}}></span>
                      <Popover
                          mask
                          visible={this.state.showPopover}
                          overlay={[
                              (<Popover.Item key="0"><span
                                  className="workrelate-popover">{getLabel(24969, "相关链接")}</span></Popover.Item>),
                              (<Popover.Item key="1"><span
                                  className="workrelate-popover">{getLabel(32061, "操作日志")}</span></Popover.Item>),
                              (<Popover.Item key="2"><span
                                  className="workrelate-popover">{getLabel(33956, "意见反馈")}</span></Popover.Item>),
                          ]}
                          onSelect={this.handlePopoverSelect}>
                        <span className="accessView-content-title-more">
                            <span className="workrelate-status" style={{background: ccolor}}>
                                {cstatus}
                            </span>
                            <Icon type="right"/>
                        </span>
                      </Popover>
                 </span>
        </div>
    }

    //处理
    handlePopoverSelect = (val, key) => {
        const {showtype} = this.store;
        this.setState({
            showPopover: false
        })
        if (val.key == 0) {
            this.store.showtype = "relatelink";
        } else if (val.key == 1) {
            if (showtype == 'log'&&this.store.canlog) {
                this.store.currentpage = 1;
                this.store.getAccessLogInfo(false);
            } else {
                this.store.showtype = "log";
            }
        } else if (val.key == 2) {
            if (showtype == 'feedback') {
                this.store.getAccessFbInfo({});
            } else {
                this.store.showtype = "feedback";
            }
        } else {
            this.store.showtype = "detail";
        }
    }
}